<!--
 * @Descripttion: 维修记录
 * @LastEditors: xzh
 * @LastEditTime: 2023-11-12 22:57:25
-->
<template>
  <el-card>
    <DileTable ref="dileTableRef">
      <template #preColumn>
        <vxe-column
          field="code"
          :title="$t('page.moldRepairArr.moldRepairRecordArr.code')"
        />
        <vxe-column
          field="name"
          :title="$t('page.moldRepairArr.moldRepairRecordArr.name')"
        />
        <vxe-column
          :title="$t('page.equipRepairArr.repairRecordArr.recordStatus')"
        >
          <template #default="{ row }">
            <span v-if="row.workOrderStatus">{{
              $t(
                `page.equipRepairArr.repairRecordArr.repairRecordStatusArr.${row.workOrderStatus}`
              )
            }}</span>
          </template>
        </vxe-column>
        <vxe-column
          field="recordType"
          :title="$t('page.equipRepairArr.repairRecordArr.recordType')"
        />
        <vxe-column
          :title="$t('page.equipRepairArr.repairRecordArr.recordGroup')"
        >
          <template #default="{ row }">
            <span>{{ row.extJson?.teamName }}</span>
          </template>
        </vxe-column>
        <vxe-column
          :title="$t('page.equipRepairArr.repairRecordArr.recordManager')"
        >
          <template #default="{ row }">
            <span>{{ row.extJson?.managerName }}</span>
          </template>
        </vxe-column>
        <vxe-column
          field="startDate"
          :title="$t('page.equipRepairArr.repairRecordArr.recordStartTime')"
          formatter="formatDateTime"
        />
        <vxe-column
          field="endDate"
          :title="$t('page.equipRepairArr.repairRecordArr.recordEndTime')"
          formatter="formatDateTime"
        />
        <vxe-column
          field="totalDuration"
          :title="$t('page.equipRepairArr.repairRecordArr.recordDuration')"
        />
        <vxe-column :title="$t('page.moldManageArr.moldArchivesArr.name')">
          <template #default="{ row }">
            <span>{{ row.relMold?.name }}</span>
          </template>
        </vxe-column>
        <vxe-column :title="$t('page.moldManageArr.moldArchivesArr.code')">
          <template #default="{ row }">
            <span>{{ row.relMold?.code }}</span>
          </template>
        </vxe-column>
        <vxe-column
          :title="$t('page.moldManageArr.moldArchivesArr.specification')"
        >
          <template #default="{ row }">
            <span>{{ row.relMold?.specification }}</span>
          </template>
        </vxe-column>
        <vxe-column :title="$t('page.moldManageArr.moldType')">
          <template #default="{ row }">
            <span>{{ row.relMold?.extJson?.typeName }}</span>
          </template>
        </vxe-column>
        <vxe-column :title="$t('page.moldManageArr.moldArchivesArr.factory')">
          <template #default="{ row }">
            <span>{{ row.extJson?.factoryName }}</span>
          </template>
        </vxe-column>
        <vxe-column
          :title="$t('page.equipRepairArr.repairRecordArr.repairPerson')"
        >
          <template #default="{ row }">
            <span>{{ row.createUser }}</span>
          </template>
        </vxe-column>
        <vxe-column :title="$t('page.moldRepairArr.moldFaultType')">
          <template #default="{ row }">
            <span>{{ row.extJson?.faultTypeName }}</span>
          </template>
        </vxe-column>
        <vxe-column
          :title="$t('page.equipRepairArr.repairRecordArr.repairLevel')"
        >
          <template #default="{ row }">
            <span>{{
              $t(
                `page.equipRepairArr.repairRecordArr.repairLevelArr.${row.level}`
              )
            }}</span>
          </template>
        </vxe-column>
        <vxe-column
          :title="$t('page.equipRepairArr.repairRecordArr.repairType')"
        >
          <template #default="{ row }">
            <!-- <span>{{
              $t(
                `page.equipRepairArr.repairRecordArr.repairTypeArr.${row.repairType}`
              )
            }}</span> -->
          </template>
        </vxe-column>
      </template>
    </DileTable>
    <!-- 维修记录表单 -->
    <RepairRecordFrom ref="repairRecordFromRef" @refresh="initTableData" />
  </el-card>
</template>

<script setup lang="ts">
import { ref, reactive, provide, onMounted } from "vue";
import type { propsParam_Inf } from "@/components/dile-table/index.type";
import type { object_Inf } from "@/utils/typings/index.type";
import { useI18n } from "vue-i18n";
import { ElNotification, ElMessageBox } from "element-plus";
import { moldRepairModuleToolEnum } from "@/utils/typings/moldManage/moldRepair/index.type";
import DileTable from "@/components/dile-table/index.vue";
import RepairRecordFrom from "./repairRecord-form/fom-drawer/index.vue";
import Dile_APi from "@/api";

/**
 * @Author: xzh
 * @Descripttion:i18n实例
 * @Param:
 */
let { t } = useI18n();

/**
 * @Author: xzh
 * @Descripttion: 维修记录表单实例
 * @Param:
 */
let repairRecordFromRef = ref<any>(null);
/**
 * @Author: xzh
 * @Descripttion: 表格实例
 * @Param:
 */
let dileTableRef = ref<any>(null);

/**
 * @Author: xzh
 * @Descripttion:初始化加载
 * @Param:
 */
onMounted(() => {
  initTableData();
});
/**
 * @Author: xzh
 * @Descripttion:表格加载事件
 * @Param:
 */
let initTableData = async () => {
  try {
    propsParam.loading = true;
    Object.assign(propsParam, {
      tableData: [],
      loading: true,
    });
    let { keyWord, pagination } = dileTableRef.value?.getTableParam(),
      { page, rows } = pagination;
    //获取维修记录列表
    let { record: tableData, total } = await Dile_APi.getMoldRepairRecordList({
      keyWord,
      pagination: {
        pageIndex: page,
        pageSize: rows,
      },
    });
    Object.assign(propsParam, {
      tableData: tableData.map((row: object_Inf) => {
        let { model, equipmentModel } = row;
        return {
          ...model,
          relMold: equipmentModel,
        };
      }),
      tableRecords: total,
    });
  } finally {
    propsParam.loading = false;
  }
};
/**
 * @Author: xzh
 * @Descripttion:工具栏按钮点击事件
 * @Param:
 * @param {*} event
 */
let handleToolBtnClick = (event: object_Inf) => {
  let { code } = event,
    { rowChecked } = dileTableRef.value;
  //![新增]->行勾选判断
  if (!["add"].includes(code) && !rowChecked()) {
    return false;
  }
  switch (code) {
    case "add":
    case "edit":
      //加载维修记录抽屉
      InitRepairRecordDrawer(code);
      break;
    case "delete":
      //删除
      handleDelete();
      break;
  }
};

/**
 * @Author: xzh
 * @Descripttion:加载维修记录抽屉
 * @Param:
 * @param {*} code
 */
let InitRepairRecordDrawer = (code: string) => {
  let { clearCheckboxRow, getTableParam } = dileTableRef.value,
    { selectObjArr } = getTableParam(),
    currentRow = selectObjArr?.find(() => true);
  //加载抽屉
  repairRecordFromRef.value.init(code == "edit" ? currentRow.id : 0);
  //清楚行选中
  code == "edit" && clearCheckboxRow([currentRow]);
};

/**
 * @Author: xzh
 * @Descripttion: 删除事件
 * @Param:
 */
let handleDelete = () => {
  ElMessageBox.confirm(
    t("common.message.deleteVerify"),
    t("common.message.confirmInfo"),
    {
      distinguishCancelAndClose: true,
      type: "warning",
      confirmButtonText: t("common.define"),
      cancelButtonText: t("common.cancel"),
    }
  ).then(async () => {
    try {
      propsParam.loading = true;
      let { selectObjArr }: object_Inf = dileTableRef.value.getTableParam();
      //删除选中维修记录
      await Dile_APi.deleteMoldRepairRecord(
        selectObjArr.map((x: object_Inf) => x.id)
      );
      //提示成功
      ElNotification({
        message: t("common.message.OperationSuccess"),
        type: "success",
      });
      //刷新表格
      initTableData();
    } finally {
      propsParam.loading = false;
    }
  });
};
/**
 * @Author: xzh
 * @Descripttion: 表格参数
 * @Param:
 */
let propsParam = reactive<propsParam_Inf>({
  moduleToolCode: moldRepairModuleToolEnum.moldRepairRecord,
  loading: false,
  checkbox: true,
  tableData: [],
  isPagination: true,
  emitEvents: {
    refreshTable: initTableData,
    toolBtnClick: handleToolBtnClick,
  },
});
provide("propsParam", propsParam);
</script>
<style lang="scss" scoped></style>
